//搜索框
var t = null
function searchBook() {

    const searchInput = document.querySelector('.searchinput')
    const searchUl = document.querySelector('.searchul')
    const aoa = document.querySelector('.aoa')
    const loading = document.querySelector('.loading');

    aoa.innerHTML = `
        <div class="seatop">
            <div class="searchtitle">
            </div>
            <p>搜“${searchInput.value}”相关作品>></p>
        </div>
    `
    if (!searchInput.value.trim()) {
        searchUl.innerHTML = ''
        aoa.innerHTML = ''
        loading.style.display = 'none';


    }
    if (t) {
        clearTimeout(t)
    }
    t = setTimeout(function () {
        if (!searchInput.value) {
            loading.style.display = 'none';
            return;
        } else {
            loading.style.display = 'block';
        }

        fetch('https://app2.motie.com/search?objectType=2&word=' + searchInput.value + '&pageSize=2').then(res => res.json()).then(res1 => {
            // console.log(res1.data.bookList)

            searchUl.innerHTML = ''
            loading.style.display = 'none';
            res1.data.bookList.forEach(item => {
                searchUl.innerHTML += `
                    <li class="searchli">
                        <img src=${item.authorIcon} alt="">
                        <div class="seatex">
                            <p class="p1">${item.name}</p>
                            <p>${item.authorName}</p>
                        </div>
                    </li>

                `

            })

        }).catch(err => {
            console.log(err)  //错误信息捕获
        })
    }, 500)


}


//返回顶部按钮
// 获取“返回顶部”按钮
const backToTopBtn = document.getElementById('backToTop');
// 监听页面滚动事件：滚动一定距离后，显示“返回顶部”按钮
window.addEventListener('scroll', () => {
    // 当滚动距离大于 300px 时，显示按钮；否则隐藏
    if (window.scrollY > 300) {
        backToTopBtn.style.display = 'block';
    } else {
        backToTopBtn.style.display = 'none';
    }
});
// 监听按钮点击事件：点击后，页面平滑滚动到顶部
backToTopBtn.addEventListener('click', () => {
    // 使用 window.scrollTo 实现平滑滚动
    window.scrollTo({
        top: 0,             // 滚动到顶部（top: 0）
        behavior: 'smooth'  // 平滑滚动效果
    });
});

//内容                //页面初始化的数值
function content(types = '5', classification = '19', free = '', word = '', statuss = '', updataType = '', pageno = '1') {
    axios.post(`https://app2.motie.com/pc/books/search?pageNo=${pageno}&pageSize=20&categoryId=${classification}&sort=${types}${free}${word}${statuss}${updataType}`, {
        // 参数名: 参数值,
        // 参数名1: 参数值1
    }).then(res => {
        console.log(res.data.data)
        const totalCount = res.data.data.paginate.totalItemsCount
        layui.use('laypage', function () {
            var laypage = layui.laypage;
            // 完整显示
            laypage.render({
                elem: 'demo-laypage-all', // 元素 id
                count: totalCount, // 数据总数
                curr: pageno, // 设置当前页码为传入的 pageno
                layout: ['count', 'prev', 'page', 'next', 'skip'], // 功能布局
                jump: function (obj, first) {
                    console.log(obj.curr); // 得到当前页，以便向服务端请求对应页的数据。
                    // 首次不执行
                    if (!first) {
                        // do something
                        content(5, 19, '', '', '', '', obj.curr)


                    }
                }
            });
        });

        const lists = res.data.data.items
        const riCon = document.querySelector('.ricon')
        riCon.innerHTML = ''
        lists.forEach(item => {
            const status = item.finish ? '已完结' : '连载中';

            // 定义时间戳（毫秒）
            const timestamp = item.lastChapterTime;
            // 创建Date对象（直接传入毫秒级时间戳）
            const date = new Date(timestamp);
            // 提取年、月、日、时、分、秒（注意月份从0开始，需要+1）
            const year = date.getFullYear();
            const month = String(date.getMonth() + 1).padStart(2, '0'); // 补零处理
            const day = String(date.getDate()).padStart(2, '0');
            const hours = String(date.getHours()).padStart(2, '0');
            const minutes = String(date.getMinutes()).padStart(2, '0');
            const seconds = String(date.getSeconds()).padStart(2, '0');
            // 拼接成指定格式（修正了重复的hours）
            const formattedTime = `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
            // console.log(formattedTime); // 正确输出：2025-08-31 09:00:08

            riCon.innerHTML += `
                <div class="con2">
                    <img src=${item.bookIconUrl}
                        alt="">
                    <div class="conn">
                        <p class="title">${item.bookName}</p>
                        <p class="p2">${item.authorName} | ${item.categoryVO.name} | ${status}</p>
                        <p class="p3">
                            ${item.introduction}
                        </p>
                        <p class="p2">
                            ${item.words}字 |
                            <span class="p22">
                                ${formattedTime}更新
                            </span>
                        </p>

                    </div>
                </div>
                `
        })
        return res;
    }).then(res1 => {
        console.log(res1)

    })
        .catch(err => {
            console.log(err)
        })
}
//初始化页面
content()

let isVisible = false;
const allCon = document.querySelector('.allcon')

//点击总人气实现下面列表显示
function popularity() {


    if (isVisible) {
        // 如果当前是显示状态，点击后隐藏
        allCon.style.display = 'none';
    } else {
        // 如果当前是隐藏状态，点击后显示
        allCon.style.display = 'block';
    }

    // 切换状态
    isVisible = !isVisible;


}

//value是传递的总人气周人气月人气的参数
function clickTop(values) {
    const all = document.querySelector('.all')
    all.innerHTML = `
        ${values}
        <img src="./img/content.png" alt="">
    `
}
clickTop('总人气')

// 总人气 周人气 月人气 点击切换
function otherPeople(event) {
    // 获取点击元素的data-type
    const type = event.target.dataset.type;
    console.log(event.target.dataset.type)
    const all = document.querySelector('.all')
    content(type, 19, '', '')

    //点击那该让哪个的样式出现
    // 获取所有可点击的元素
    const clickableItems = document.querySelectorAll('.clickable-item');
    // 遍历这些元素
    clickableItems.forEach(item => {
        // 如果不是当前点击的元素，就重置颜色为默认（这里假设默认是黑色）
        if (item !== event.target) {
            item.style.color = '';
        } else {
            // 当前点击的元素设置为蓝色
            item.style.color = '#1eb9ee';
        }
    });
    allCon.style.display = 'none'
    console.log(event.target.innerHTML)
    clickTop(event.target.innerHTML)
    all.style.color = '#1eb9ee';

    ri1(event.target.dataset.total)


}

//左上角作品总数函数
const ri = document.querySelector('.ri')
function ri1(overall) {
    ri.innerHTML = `
    共${overall}部作品
    `
}
ri1(515)



// 更新时间 推荐票数 字数  点击切换
function otherPeople2(event) {
    console.log(event.target.dataset.type)


    const connsEver = document.querySelectorAll('.connsever');
    connsEver.forEach(item => {
        console.log(item.dataset.type);
    });


    content(event.target.dataset.type, 19, '', '', '', '') //怎样不写死？？？？？？？？？？？？？？
    // 获取所有可点击的元素
    const clickableItems = document.querySelectorAll('.clickable-item');
    // 遍历这些元素
    clickableItems.forEach(item => {
        // 如果不是当前点击的元素，就重置颜色为默认（这里假设默认是黑色）
        if (item !== event.target) {
            item.style.color = '';
        } else {
            // 当前点击的元素设置为蓝色
            item.style.color = '#1eb9ee';
        }
    });
    allCon.style.display = 'none'
    const all = document.querySelector('.all')
    all.style.color = '#000000';

    ri1(event.target.dataset.total)

}
let tap = true

//分类里面点击显示灰色小模块
function beArranged(event) {


    if (event.target.dataset.type == 97) {
        const listCon = document.querySelector('.listcon')
        if (tap) {
            listCon.style.display = 'block'

        } else {
            listCon.style.display = 'none'
        }
        tap = !tap
    }

    if (event.target.dataset.type == 98) {
        const listCon2 = document.querySelector('.listcon2')
        if (tap) {
            listCon2.style.display = 'block'

        } else {
            listCon2.style.display = 'none'
        }
        tap = !tap
    }

    if (event.target.dataset.type == 100) {
        const listCon3 = document.querySelector('.listcon3')
        if (tap) {
            listCon3.style.display = 'block'

        } else {
            listCon3.style.display = 'none'
        }
        tap = !tap
    }

    const categoryItems = document.querySelectorAll('.category-item');
    categoryItems.forEach(item => {
        if (item === event.target) {
            // 当前点击的元素：添加 list 类（蓝色样式）
            item.classList.add('list');
        } else {
            // 非当前点击的元素：移除 list 类（恢复黑色样式）
            item.classList.remove('list');
        }
    });
}


//分类里面的小模块点击函数
function beArranged1(event) {
    console.log(event.target.dataset.type)
    content(5, event.target.dataset.type, '', '', '', '') //5怎样不写死？？？？？？？？？？？？？？？？？？？？？？？？
}

//字数点击函数
function beArranged2(event) {
    const categoryItems = document.querySelectorAll('.category-item2');
    categoryItems.forEach(item => {
        if (item === event.target) {
            // 当前点击的元素：添加 list 类（蓝色样式）
            item.classList.add('list');
        } else {
            // 非当前点击的元素：移除 list 类（恢复黑色样式）
            item.classList.remove('list');
        }
    });
    content(5, 19, '', `&words=${event.target.dataset.type}`, '', '')

}

//属性点击函数
function beArranged3(event) {
    const categoryItems = document.querySelectorAll('.category-item3');
    categoryItems.forEach(item => {
        if (item === event.target) {
            // 当前点击的元素：添加 list 类（蓝色样式）
            item.classList.add('list');
        } else {
            // 非当前点击的元素：移除 list 类（恢复黑色样式）
            item.classList.remove('list');
        }
    });
    content(5, 19, `&free=${event.target.dataset.type}`, '', '', '')

}

//状态点击函数
function beArranged4(event) {
    const categoryItems = document.querySelectorAll('.category-item4');
    categoryItems.forEach(item => {
        if (item === event.target) {
            // 当前点击的元素：添加 list 类（蓝色样式）
            item.classList.add('list');
        } else {
            // 非当前点击的元素：移除 list 类（恢复黑色样式）
            item.classList.remove('list');
        }
    });
    content(5, 19, '', '', `&finish=${event.target.dataset.type}`, '')

}

//更新时间点击函数
function beArranged5(event) {
    const categoryItems = document.querySelectorAll('.category-item5');
    categoryItems.forEach(item => {
        if (item === event.target) {
            // 当前点击的元素：添加 list 类（蓝色样式）
            item.classList.add('list');
        } else {
            // 非当前点击的元素：移除 list 类（恢复黑色样式）
            item.classList.remove('list');
        }
    });
    content(5, 19, '', '', '', `&updateDateType=${event.target.dataset.type}`)

}




